<template lang="pug">
div(v-if="visible")
    div(class="weui-mask")
    div(class="weui-dialog")
        div(class="weui-dialog__hd")
            strong(class="weui-dialog__title") {{title}}
        div(class="weui-dialog__bd") {{content}}
        div(class="weui-dialog__ft")
            a(href="javascript:;" v-for="button in buttons" 
                @click.stop="triggerClick(button.value)"
                :class="`weui-dialog__btn weui-dialog__btn_${button.type}`") {{button.label}}
</template>
<script>
export default {
  props: {
    visible: { type: Boolean, default: false },
    title: { type: String, default: "" },
    content: { type: String, default: "" },
    buttons: {
      type: Array,
      default() {
        return [
          { label: "确认", value: "ok", type: "default" },
          { label: "取消", value: "cancel", type: "primary" }
        ];
      }
    }
  },
  methods: {
    triggerClick(value) {
      this.$emit("click", value);
    }
  }
};
</script>
